<!doctype html>
<html lang="en">

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!--favicon-->

    <!--plugins-->
    <link href="css/simplebar.css" rel="stylesheet">
    <link href="css/perfect-scrollbar.css" rel="stylesheet">
    <link href="css/metisMenu.min.css" rel="stylesheet">
    <link href="css/dataTables.bootstrap5.min.css" rel="stylesheet">
    <!-- loader-->
    <link href="css/pace.min.css" rel="stylesheet">
    <script src="js/pace.min.js"></script>
    <!-- Bootstrap CSS -->
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/css2.css" rel="stylesheet">
    <link href="css/app.css" rel="stylesheet">
    <link href="css/icons.css" rel="stylesheet">
    <!-- Theme Style CSS -->
    <link rel="stylesheet" href="css/dark-theme.css">
    <link rel="stylesheet" href="css/semi-dark.css">
    <link rel="stylesheet" href="css/header-colors.css">
    <!--layui-css-->
    <link href="layui/css/layui.css" rel="stylesheet">
    <!--icon-->
    <script src="icon/file/iconfont.js"></script>
    <!--echartstool-->
    <link rel="stylesheet" href="css/mine/EchartsTools.css">

    <title>榆园财务管理系统</title>

    <style>
        th {
            text-align: center;
        }

        td {
            text-align: center;
        }

        .icon {
            width: 1em;
            height: 1em;
            vertical-align: -0.15em;
            fill: currentColor;
            overflow: hidden;
        }

        .mine-table{

        }
        .mine-table tr{
            background-color: white;
            border-color: black;
        }
    </style>
</head>

<body>
<!--wrapper-->
<div class="wrapper">
    <!--sidebar wrapper -->
    <div class="sidebar-wrapper" data-simplebar="true">
        <div class="sidebar-header">
            <div>
                <img src="picture/logo-icon.png" class="logo-icon" alt="logo icon">
            </div>
            <div>
                <h4 class="logo-text">榆园财务系统</h4>
            </div>
            <div class="toggle-icon ms-auto"><i class='bx bx-arrow-to-left'></i>
            </div>
        </div>
        <!--navigation-->
        <ul class="metismenu" id="menu">
            <li class="menu-label">数据展示</li>
            <li>
                <a href="javascript:;" class="has-arrow">
                    <div class="parent-icon"><i class='lni lni-graph'></i>
                    </div>
                    <div class="menu-title">数据大屏</div>
                </a>
                <ul>
                    <li><a href="index.html"><i class="bx bx-chalkboard"></i>大屏1</a>
                    </li>
                    <li><a href="error/errors-coming-soon.html"><i class="bx bx-chalkboard"></i>大屏2</a>
                    </li>
                </ul>
            </li>
            <li class="menu-label">数据汇总</li>
            <li>
                <a href="javascript:;" class="has-arrow">
                    <div class="parent-icon"><i class="bx bx-abacus"></i>
                    </div>
                    <div class="menu-title">利润分析</div>
                </a>
                <ul>
                    <li><a href="lrfx.html"><i class="bx bxs-dollar-circle"></i>利润分析</a>
                    </li>
                    <li><a href=""><i class="lni lni-bar-chart"></i>费用统计</a>
                    </li>
                    <li><a href="shopcompare.html"><i class="bx bxs-store"></i>按店对比</a>
                    </li>
                    <li><a href="subcompare.html"><i class="bx bxs-category"></i>按科目对比</a>
                    </li>
                </ul>
            </li>
            <li class="menu-label">分项明细</li>
            <li>
                <a href="javascript:;" class="has-arrow">
                    <div class="parent-icon"><i class="bx bx-category"></i>
                    </div>
                    <div class="menu-title">分项明细</div>
                </a>
                <ul>
                    <li><a href="cbxsmx.html"><i class="bx bxs-tree"></i>成本销售</a>
                    </li>
                    <li><a href="DpdkCwfy/cwfy.html"><i class="bx bxs-badge-dollar"></i>财务费用</a>
                    </li>
                    <li><a href="Dpyy/dpyy.html"><i class="bx bxs-store"></i>店铺运营</a>
                    </li>
                    <li><a href="salelist.html"><i class="bx bxs-spreadsheet"></i>销售统计</a>
                    </li>
                    <li><a href="DpdkCwfy/return.html"><i class="bx bxs-archive-out"></i>店铺打款</a>
                    </li>
                    <li><a href="express.html"><i class="bx bxs-car-mechanic"></i>快递费用</a>
                    </li>
                    <li><a href="bcf.html"><i class="bx bxs-briefcase-alt"></i>包材费用</a>
                    </li>
                </ul>
            </li>
            <li class="menu-label">数据管理</li>
            <li>
                <a href="javascript:;" class="has-arrow">
                    <div class="parent-icon"><i class='bx bx-data'></i>
                    </div>
                    <div class="menu-title">数据导入</div>
                </a>
                <ul>
                    <li><a href="import_data.html"><i class="bx bxs-file-import"></i>数据导入</a>
                    </li>
                    <li><a href="addflows.html"><i class="bx bxs-comment-add"></i>手动添加</a>
                    </li>
                </ul>
            </li>
            <li>
                <a class="has-arrow" href="javascript:;">
                    <div class="parent-icon"><i class='bx bx-calculator'></i>
                    </div>
                    <div class="menu-title">数据校验</div>
                </a>
                <ul>
                    <li><a href="cbxsjy.html"><i class="bx bxs-tree"></i>成本销售</a>
                    </li>
                    <li><a href="DpdkCwfy/cwfy.html"><i class="bx bxs-badge-dollar"></i>财务费用</a>
                    </li>
                    <li><a href="Dpyy/dpyy.html"><i class="bx bxs-store"></i>店铺运营</a>
                    </li>
                    <li><a href="salelist.html"><i class="bx bxs-spreadsheet"></i>销售统计</a>
                    </li>
                    <li><a href="DpdkCwfy/return.html"><i class="bx bxs-archive-out"></i>店铺打款</a>
                    </li>
                    <li><a href="expressCheck.html"><i class="bx bxs-car-mechanic"></i>快递费用</a>
                    </li>
                    <li><a href="bcf2.html"><i class="bx bxs-briefcase-alt"></i>包材费用</a>
                </ul>
            </li>
            <li class="menu-label">系统设置</li>
            <li>
                <a class="has-arrow" href="javascript:;">
                    <div class="parent-icon"><i class='bx bx-archive'></i>
                    </div>
                    <div class="menu-title">企业信息</div>
                </a>
                <ul>
                    <li><a href="company.html"><i class="bx bxs-factory"></i>企业信息</a>
                    </li>
                    <li><a href="shopfind.html"><i class="bx bxs-store"></i>店铺信息</a>
                    </li>
                    <li><a href="store/storelist.html"><i class="bx bxs-building-house"></i>货仓信息</a>
                    </li>
                </ul>
            </li>
            <li>
                <a class="has-arrow" href="javascript:;">
                    <div class="parent-icon"><i class="bx bx-money"></i>
                    </div>
                    <div class="menu-title">财务信息</div>
                </a>
                <ul>
                    <li><a href="flows.html"><i class="bx bxs-file"></i>费用流水</a>
                    </li>
                    <li><a href="subject.html"><i class="bx bxs-book"></i>科目信息</a>
                    </li>
                    <li><a href="flowfee.html"><i class="bx bxs-baby-carriage"></i>物流运费</a>
                    </li>
                    <li><a href="packfee.html"><i class="bx bxs-package"></i>包材费用</a>
                    </li>
                    <li><a href="operateFee/operateFee.html"><i class="bx bxs-magic-wand"></i>操作费用</a>
                    </li>
                    <li><a href="buyprice.html"><i class="bx bxs-cart"></i>采购价格</a>
                    </li>
                </ul>
            </li>
            <li class="menu-label">用户设置</li>
            <li>
                <a class="has-arrow" href="javascript:;">
                    <div class="parent-icon"><i class='bx bx-user-check'></i>
                    </div>
                    <div class="menu-title">用户信息</div>
                </a>
                <ul>
                    <li><a href="user.html"><i class="bx bxs-user"></i>信息修改</a>
                    </li>
                    <li><a href="password.html"><i class="bx bxs-key"></i>设置密码</a>
                    </li>
                </ul>
            </li>
        </ul>
        <!--end navigation-->
    </div>


    <!--end sidebar wrapper -->
    <!--start header -->

    <!-- display=none 直接注释掉会使js报错-->
    <header>
        <div class="topbar d-flex align-items-center">

            <!--头部-->
            <div class="mobile-toggle-menu"><i class='bx bx-menu'></i>
            </div>

            <!--display=none-->
            <nav class="navbar navbar-expand" style="display: none;">
                <div class="mobile-toggle-menu"><i class='bx bx-menu'></i>
                </div>
                <div class="search-bar flex-grow-1">
                    <div class="position-relative search-bar-box">
                        <input type="text" class="form-control search-control" placeholder="Type to search..."> <span
                            class="position-absolute top-50 search-show translate-middle-y"><i class='bx bx-search'></i></span>
                        <span class="position-absolute top-50 search-close translate-middle-y"><i
                                class='bx bx-x'></i></span>
                    </div>
                </div>
                <div class="top-menu ms-auto">
                    <ul class="navbar-nav align-items-center">
                        <li class="nav-item mobile-search-icon">
                            <a class="nav-link" href="#"> <i class='bx bx-search'></i>
                            </a>
                        </li>
                        <li class="nav-item dropdown dropdown-large">
                            <a class="nav-link dropdown-toggle dropdown-toggle-nocaret" href="#" role="button"
                               data-bs-toggle="dropdown" aria-expanded="false"> <i class='bx bx-category'></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <div class="row row-cols-3 g-3 p-3">
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-cosmic text-white"><i
                                                class='bx bx-group'></i>
                                        </div>
                                        <div class="app-title">Teams</div>
                                    </div>
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-burning text-white"><i
                                                class='bx bx-atom'></i>
                                        </div>
                                        <div class="app-title">Projects</div>
                                    </div>
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-lush text-white"><i
                                                class='bx bx-shield'></i>
                                        </div>
                                        <div class="app-title">Tasks</div>
                                    </div>
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-kyoto text-dark"><i
                                                class='bx bx-notification'></i>
                                        </div>
                                        <div class="app-title">Feeds</div>
                                    </div>
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-blues text-dark"><i
                                                class='bx bx-file'></i>
                                        </div>
                                        <div class="app-title">Files</div>
                                    </div>
                                    <div class="col text-center">
                                        <div class="app-box mx-auto bg-gradient-moonlit text-white"><i
                                                class='bx bx-filter-alt'></i>
                                        </div>
                                        <div class="app-title">Alerts</div>
                                    </div>
                                </div>
                            </div>
                        </li>
                        <li class="nav-item dropdown dropdown-large">
                            <a class="nav-link dropdown-toggle dropdown-toggle-nocaret position-relative" href="#"
                               role="button" data-bs-toggle="dropdown" aria-expanded="false"> <span class="alert-count">7</span>
                                <i class='bx bx-bell'></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="javascript:;">
                                    <div class="msg-header">
                                        <p class="msg-header-title">Notifications</p>
                                        <p class="msg-header-clear ms-auto">Marks all as read</p>
                                    </div>
                                </a>
                                <div class="header-notifications-list">
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-primary text-primary"><i
                                                    class="bx bx-group"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">New Customers<span class="msg-time float-end">14 Sec
												ago</span></h6>
                                                <p class="msg-info">5 new user registered</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-danger text-danger"><i
                                                    class="bx bx-cart-alt"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">New Orders <span class="msg-time float-end">2 min
												ago</span></h6>
                                                <p class="msg-info">You have recived new orders</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-success text-success"><i class="bx bx-file"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">24 PDF File<span class="msg-time float-end">19 min
												ago</span></h6>
                                                <p class="msg-info">The pdf files generated</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-warning text-warning"><i class="bx bx-send"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Time Response <span class="msg-time float-end">28 min
												ago</span></h6>
                                                <p class="msg-info">5.1 min avarage time response</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-info text-info"><i
                                                    class="bx bx-home-circle"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">New Product Approved <span
                                                        class="msg-time float-end">2 hrs ago</span></h6>
                                                <p class="msg-info">Your new product has approved</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-danger text-danger"><i
                                                    class="bx bx-message-detail"></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">New Comments <span class="msg-time float-end">4 hrs
												ago</span></h6>
                                                <p class="msg-info">New customer comments recived</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-success text-success"><i
                                                    class='bx bx-check-square'></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Your item is shipped <span
                                                        class="msg-time float-end">5 hrs
												ago</span></h6>
                                                <p class="msg-info">Successfully shipped your item</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-primary text-primary"><i
                                                    class='bx bx-user-pin'></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">New 24 authors<span class="msg-time float-end">1 day
												ago</span></h6>
                                                <p class="msg-info">24 new authors joined last week</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="notify bg-light-warning text-warning"><i
                                                    class='bx bx-door-open'></i>
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Defense Alerts <span class="msg-time float-end">2 weeks
												ago</span></h6>
                                                <p class="msg-info">45% less alerts last 4 weeks</p>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <a href="javascript:;">
                                    <div class="text-center msg-footer">View All Notifications</div>
                                </a>
                            </div>
                        </li>
                        <li class="nav-item dropdown dropdown-large">
                            <a class="nav-link dropdown-toggle dropdown-toggle-nocaret position-relative" href="#"
                               role="button" data-bs-toggle="dropdown" aria-expanded="false"> <span class="alert-count">8</span>
                                <i class='bx bx-comment'></i>
                            </a>
                            <div class="dropdown-menu dropdown-menu-end">
                                <a href="javascript:;">
                                    <div class="msg-header">
                                        <p class="msg-header-title">Messages</p>
                                        <p class="msg-header-clear ms-auto">Marks all as read</p>
                                    </div>
                                </a>
                                <div class="header-message-list">
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-1.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Daisy Anderson <span class="msg-time float-end">5 sec
												ago</span></h6>
                                                <p class="msg-info">The standard chunk of lorem</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-2.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Althea Cabardo <span class="msg-time float-end">14
												sec ago</span></h6>
                                                <p class="msg-info">Many desktop publishing packages</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-3.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Oscar Garner <span class="msg-time float-end">8 min
												ago</span></h6>
                                                <p class="msg-info">Various versions have evolved over</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-4.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Katherine Pechon <span class="msg-time float-end">15
												min ago</span></h6>
                                                <p class="msg-info">Making this the first true generator</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-5.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Amelia Doe <span class="msg-time float-end">22 min
												ago</span></h6>
                                                <p class="msg-info">Duis aute irure dolor in reprehenderit</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-6.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Cristina Jhons <span class="msg-time float-end">2 hrs
												ago</span></h6>
                                                <p class="msg-info">The passage is attributed to an unknown</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-7.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">James Caviness <span class="msg-time float-end">4 hrs
												ago</span></h6>
                                                <p class="msg-info">The point of using Lorem</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-8.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Peter Costanzo <span class="msg-time float-end">6 hrs
												ago</span></h6>
                                                <p class="msg-info">It was popularised in the 1960s</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-9.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">David Buckley <span class="msg-time float-end">2 hrs
												ago</span></h6>
                                                <p class="msg-info">Various versions have evolved over</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-10.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Thomas Wheeler <span class="msg-time float-end">2 days
												ago</span></h6>
                                                <p class="msg-info">If you are going to use a passage</p>
                                            </div>
                                        </div>
                                    </a>
                                    <a class="dropdown-item" href="javascript:;">
                                        <div class="d-flex align-items-center">
                                            <div class="user-online">
                                                <img src="/picture/avatar-11.png" class="msg-avatar" alt="user avatar">
                                            </div>
                                            <div class="flex-grow-1">
                                                <h6 class="msg-name">Johnny Seitz <span class="msg-time float-end">5 days
												ago</span></h6>
                                                <p class="msg-info">All the Lorem Ipsum generators</p>
                                            </div>
                                        </div>
                                    </a>
                                </div>
                                <a href="javascript:;">
                                    <div class="text-center msg-footer">View All Messages</div>
                                </a>
                            </div>
                        </li>
                    </ul>
                </div>
                <div class="user-box dropdown">
                    <a class="d-flex align-items-center nav-link dropdown-toggle dropdown-toggle-nocaret" href="#"
                       role="button" data-bs-toggle="dropdown" aria-expanded="false">
                        <img src="/picture/avatar-2.png" class="user-img" alt="user avatar">
                        <div class="user-info ps-3">
                            <p class="user-name mb-0">Pauline Seitz</p>
                            <p class="designattion mb-0">Web Designer</p>
                        </div>
                    </a>
                    <ul class="dropdown-menu dropdown-menu-end">
                        <li><a class="dropdown-item" href="javascript:;"><i class="bx bx-user"></i><span>Profile</span></a>
                        </li>
                        <li><a class="dropdown-item" href="javascript:;"><i class="bx bx-cog"></i><span>Settings</span></a>
                        </li>
                        <li><a class="dropdown-item" href="javascript:;"><i class='bx bx-home-circle'></i><span>Dashboard</span></a>
                        </li>
                        <li><a class="dropdown-item" href="javascript:;"><i class='bx bx-dollar-circle'></i><span>Earnings</span></a>
                        </li>
                        <li><a class="dropdown-item" href="javascript:;"><i
                                class='bx bx-download'></i><span>Downloads</span></a>
                        </li>
                        <li>
                            <div class="dropdown-divider mb-0"></div>
                        </li>
                        <li><a class="dropdown-item" href="javascript:;"><i class='bx bx-log-out-circle'></i><span>Logout</span></a>
                        </li>
                    </ul>
                </div>
            </nav>
        </div>
    </header>
    <!--end header -->

    <!-- 页面 -->
    <!--start page wrapper -->
    <div class="page-wrapper">
        <div class="page-content">

            <!--面包屑-->
            <div class="page-breadcrumb d-none d-sm-flex align-items-center mb-3">
                <div class="breadcrumb-title pe-3">利润分析</div>
                <div class="ps-3">
                    <nav aria-label="breadcrumb">
                        <ol class="breadcrumb mb-0 p-0">
                            <li class="breadcrumb-item"><a href="javascript:;"><i class="bx bx-home-alt"></i></a>
                            </li>
                            <li class="breadcrumb-item active" aria-current="page">费用统计</li>
                        </ol>
                    </nav>
                </div>
            </div>

            <!-- 页面部分 -->
            <div class="card" style="min-height: 735px;">
                <div class="card-body">
                    <!--柱状图-->
                    <div style="width: 100%;overflow: auto;">
                        <div id="main" style="height: 600px;width: 100%;">

                        </div>
                    </div>

                    <!--表格-->
                    <div>
                        <!--当期-->
                        <div class="table-responsive" style="margin: 15px 0px;overflow: auto;width: 100%;">
                            <table class="table table-bordered mine-table" id="table-dq">

                            </table>
                        </div>

                        <!--同比-->
                        <div class="table-responsive" style="margin: 15px 0px;overflow: auto;width: 100%;">
                            <table class="table table-bordered mine-table" id="table-tb">

                            </table>
                        </div>

                        <!-- 环比-->
                        <div class="table-responsive" style="margin: 15px 0px;overflow: auto;width: 100%;">
                            <table class="table table-bordered mine-table" id="table-hb">

                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--end page wrapper -->


        <!--start overlay-->
        <div class="overlay toggle-icon"></div>
        <!--end overlay-->


        <!--Start Back To Top Button--> <a href="javaScript:;" class="back-to-top"><i
            class='bx bxs-up-arrow-alt'></i></a>
        <!--End Back To Top Button-->
        <footer class="page-footer">
            <p class="mb-0">Copyright © 2022. All right reserved.</p>
        </footer>
    </div>
    <!--end wrapper-->


    <!--start switcher-->
    <!-- display=none 直接注释掉会使js报错-->
    <div class="switcher-wrapper" style="display: none;">
        <div class="switcher-btn"><i class='bx bx-cog bx-spin'></i>
        </div>
        <div class="switcher-body">
            <div class="d-flex align-items-center">
                <h5 class="mb-0 text-uppercase">Theme Customizer</h5>
                <button type="button" class="btn-close ms-auto close-switcher" aria-label="Close"></button>
            </div>
            <hr>
            <h6 class="mb-0">Theme Styles</h6>
            <hr>
            <div class="d-flex align-items-center justify-content-between">
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="flexRadioDefault" id="lightmode" checked="">
                    <label class="form-check-label" for="lightmode">Light</label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="flexRadioDefault" id="darkmode">
                    <label class="form-check-label" for="darkmode">Dark</label>
                </div>
                <div class="form-check">
                    <input class="form-check-input" type="radio" name="flexRadioDefault" id="semidark">
                    <label class="form-check-label" for="semidark">Semi Dark</label>
                </div>
            </div>
            <hr>
            <div class="form-check">
                <input class="form-check-input" type="radio" id="minimaltheme" name="flexRadioDefault">
                <label class="form-check-label" for="minimaltheme">Minimal Theme</label>
            </div>
            <hr>
            <h6 class="mb-0">Header Colors</h6>
            <hr>
            <div class="header-colors-indigators">
                <div class="row row-cols-auto g-3">
                    <div class="col">
                        <div class="indigator headercolor1" id="headercolor1"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor2" id="headercolor2"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor3" id="headercolor3"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor4" id="headercolor4"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor5" id="headercolor5"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor6" id="headercolor6"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor7" id="headercolor7"></div>
                    </div>
                    <div class="col">
                        <div class="indigator headercolor8" id="headercolor8"></div>
                    </div>
                </div>
            </div>
            <hr>
            <h6 class="mb-0">Sidebar Colors</h6>
            <hr>
            <div class="header-colors-indigators">
                <div class="row row-cols-auto g-3">
                    <div class="col">
                        <div class="indigator sidebarcolor1" id="sidebarcolor1"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor2" id="sidebarcolor2"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor3" id="sidebarcolor3"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor4" id="sidebarcolor4"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor5" id="sidebarcolor5"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor6" id="sidebarcolor6"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor7" id="sidebarcolor7"></div>
                    </div>
                    <div class="col">
                        <div class="indigator sidebarcolor8" id="sidebarcolor8"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!--end switcher-->


    <!-- Bootstrap JS -->
    <script src="js/bootstrap.bundle.min.js"></script>
    <!--plugins-->
    <script src="js/jquery.min.js"></script>
    <script src="js/simplebar.min.js"></script>
    <script src="js/metisMenu.min.js"></script>
    <script src="js/perfect-scrollbar.js"></script>
    <script src="js/jquery.dataTables.min.js"></script>
    <script src="js/dataTables.bootstrap5.min.js"></script>
    <!--app JS-->
    <script src="js/app.js"></script>
    <!--layui-js-->
    <script src="layui/layui.js"></script>
    <script src="js/mine/mine.js"></script>
    <script src="js/echarts.js"></script>
    <script src="js/mine/EchartsTools.js"></script>

    <script>
        // 加载表格
        function load_dq(mydata) {
            let str = '';
            str = str + '<tr style="font-weight: bold;background-color: #fac858">' +
                '<td rowspan="12" style="vertical-align: middle;font-weight: bold;background-color: white;">当期</td>' +
                '<td>项目</td>' +
                '<td>累计执行</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + mydata.shop[i] + '(' + (i+1) + ')</td>'
            }
            str = str + '</tr>';

            // 产品占比
            str = str + '<tr>' +

                '<td>产品占比</td>';
            let ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.产品占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.产品占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 人工占比
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.人工占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.人工占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 综合管理费占比（各仓）
            str = str + '<tr>' + '<td>综合管理费占比（各仓）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq["综合管理费占比（各仓）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq["综合管理费占比（各仓）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 五项费用
            str = str + '<tr>' + '<td>五项费用</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.五项费用[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.五项费用[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 其他费用（房租、折旧）
            str = str + '<tr>' + '<td>其他费用（房租、折旧）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq["其他费用（房租、折旧）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq["其他费用（房租、折旧）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 平台费用占比（包含售后）
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq["平台费用占比（包含售后）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq["平台费用占比（包含售后）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 推广费用占比
            str = str + '<tr>' + '<td>推广费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.推广费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.推广费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 物流费用占比
            str = str + '<tr>' + '<td>物流费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.物流费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.物流费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 包装费用占比
            str = str + '<tr>' + '<td>包装费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.包装费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.包装费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 费用占比合计
            str = str + '<tr>' + '<td>费用占比合计</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.费用占比合计[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.费用占比合计[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 利润比例
            str = str + '<tr style="background-color: #fac858">' + '<td>利润比例</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.dq.利润比例[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.dq.利润比例[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            document.getElementById('table-dq').innerHTML = str;
        }

        function load_tb(mydata) {
            let str = '';
            str = str + '<tr style="font-weight: bold;background-color: #fac858;">' +
                '<td rowspan="12" style="vertical-align: middle;font-weight: bold;background-color: white;">同比</td>' +
                '<td>项目</td>' +
                '<td>累计执行</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + mydata.shop[i] + '(' + (i+1) + ')</td>'
            }
            str = str + '</tr>';

            // 产品占比
            str = str + '<tr>' +
                '<td>产品占比</td>';
            let ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.产品占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.产品占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 人工占比
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.人工占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.人工占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 综合管理费占比（各仓）
            str = str + '<tr>' + '<td>综合管理费占比（各仓）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb["综合管理费占比（各仓）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb["综合管理费占比（各仓）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 五项费用
            str = str + '<tr>' + '<td>五项费用</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.五项费用[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.五项费用[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 其他费用（房租、折旧）
            str = str + '<tr>' + '<td>其他费用（房租、折旧）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb["其他费用（房租、折旧）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb["其他费用（房租、折旧）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 平台费用占比（包含售后）
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb["平台费用占比（包含售后）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb["平台费用占比（包含售后）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 推广费用占比
            str = str + '<tr>' + '<td>推广费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.推广费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.推广费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 物流费用占比
            str = str + '<tr>' + '<td>物流费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.物流费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.物流费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 包装费用占比
            str = str + '<tr>' + '<td>包装费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.包装费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.包装费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 费用占比合计
            str = str + '<tr>' + '<td>费用占比合计</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.费用占比合计[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.费用占比合计[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 利润比例
            str = str + '<tr style="background-color: #FFB800">' + '<td>利润比例</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.tb.利润比例[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.tb.利润比例[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            document.getElementById('table-tb').innerHTML = str;
        }

        function load_hb(mydata) {
            let str = '';
            str = str + '<tr style="font-weight: bold;background-color: #fac858">' +
                '<td rowspan="12" style="vertical-align: middle;font-weight: bold;background-color: white;">环比</td>' +
                '<td>项目</td>' +
                '<td>累计执行</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + mydata.shop[i] + '(' + (i+1) + ')</td>'
            }
            str = str + '</tr>';

            // 产品占比
            str = str + '<tr>' +
                '<td>产品占比</td>';
            let ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.产品占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.产品占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 人工占比
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.人工占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.人工占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 综合管理费占比（各仓）
            str = str + '<tr>' + '<td>综合管理费占比（各仓）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb["综合管理费占比（各仓）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb["综合管理费占比（各仓）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 五项费用
            str = str + '<tr>' + '<td>五项费用</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.五项费用[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.五项费用[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 其他费用（房租、折旧）
            str = str + '<tr>' + '<td>其他费用（房租、折旧）</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb["其他费用（房租、折旧）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb["其他费用（房租、折旧）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 平台费用占比（包含售后）
            str = str + '<tr>' + '<td>人工占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb["平台费用占比（包含售后）"][i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb["平台费用占比（包含售后）"][i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 推广费用占比
            str = str + '<tr>' + '<td>推广费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.推广费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.推广费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 物流费用占比
            str = str + '<tr>' + '<td>物流费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.物流费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.物流费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 包装费用占比
            str = str + '<tr>' + '<td>包装费用占比</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.包装费用占比[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.包装费用占比[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 费用占比合计
            str = str + '<tr>' + '<td>费用占比合计</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.费用占比合计[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.费用占比合计[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            // 利润比例
            str = str + '<tr style="background-color: #FFB800">' + '<td>利润比例</td>';
            ljzx = 0.00;
            for (let i = 0; i < mydata.shop.length; i++) {
                ljzx = ljzx + mydata.hb.利润比例[i];
            }
            str = str + '<td>' + (ljzx * 100).toFixed(2) + '%</td>';
            for (let i = 0; i < mydata.shop.length; i++) {
                str = str + '<td>' + (mydata.hb.利润比例[i] * 100).toFixed(2) + '%</td>'
            }
            str = str + '</tr>'

            document.getElementById('table-hb').innerHTML = str;
        }
    </script>

    <script>
        let mydata = {
            "shop": [],
            "shop2": [],
            "dq": {
                "产品占比": [],
                "人工占比": [],
                "综合管理费占比（各仓）": [],
                "五项费用": [],
                "其他费用（房租、折旧）": [],
                "平台费用占比（包含售后）": [],
                "推广费用占比": [],
                "物流费用占比": [],
                "包装费用占比": [],
                "费用占比合计": [],
                "利润比例": []
            },
            "tb": {
                "产品占比": [],
                "人工占比": [],
                "综合管理费占比（各仓）": [],
                "五项费用": [],
                "其他费用（房租、折旧）": [],
                "平台费用占比（包含售后）": [],
                "推广费用占比": [],
                "物流费用占比": [],
                "包装费用占比": [],
                "费用占比合计": [],
                "利润比例": []
            },
            "hb": {
                "产品占比": [],
                "人工占比": [],
                "综合管理费占比（各仓）": [],
                "五项费用": [],
                "其他费用（房租、折旧）": [],
                "平台费用占比（包含售后）": [],
                "推广费用占比": [],
                "物流费用占比": [],
                "包装费用占比": [],
                "费用占比合计": [],
                "利润比例": []
            }
        };

        function loadMydata(mydata) {
        }

        // 获取数据
        // 当期
        $.ajax({
            type: 'get',
            url: 'fytj',
            data: {
                // now当前账期    lastmouth上一个月 环比   lastyear上一年  同比
                zq: 'now'
            },
            async: false,
            success: function (data) {
                //console.log(data);
                loadMydata(mydata);
                let d = data.data;
                console.log(d);
                let n = 0;
                for (let i = 0; i < d.length; i++) {
                    if (d[i].sjxsje != 0) {
                        mydata.shop[i] = d[i].name;
                        mydata.shop2[i] = i+1;
                        mydata.dq.产品占比[i] = d[i].erp / d[i].sjxsje;
                        mydata.dq.人工占比[i] = d[i].ryfy / d[i].sjxsje;
                        mydata.dq["综合管理费占比（各仓）"][i] = d[i].zhglf / d[i].sjxsje;
                        mydata.dq.五项费用[i] = d[i].wxfy / d[i].sjxsje;
                        mydata.dq["其他费用（房租、折旧）"][i] = d[i].qtfy / d[i].sjxsje;
                        mydata.dq["平台费用占比（包含售后）"][i] = d[i].dpyyfy / d[i].sjxsje;
                        mydata.dq.推广费用占比[i] = d[i].tgfy / d[i].sjxsje;
                        mydata.dq.物流费用占比[i] = d[i].wlf / d[i].sjxsje;
                        mydata.dq.包装费用占比[i] = d[i].bcf / d[i].sjxsje;
                        mydata.dq.费用占比合计[i] = mydata.dq.产品占比[i] + mydata.dq.人工占比[i] + mydata.dq["综合管理费占比（各仓）"][i] + mydata.dq.五项费用[i] +
                            mydata.dq["其他费用（房租、折旧）"][i] + mydata.dq["平台费用占比（包含售后）"][i] + mydata.dq.推广费用占比[i] +
                            mydata.dq.物流费用占比[i] + mydata.dq.包装费用占比[i];
                        mydata.dq.利润比例[i] = 1 - mydata.dq.费用占比合计[i];
                    } else {
                        mydata.shop[i] = d[i].name;
                        mydata.shop2[i] = i+1;
                        mydata.dq.产品占比[i] = 0;
                        mydata.dq.人工占比[i] = 0;
                        mydata.dq["综合管理费占比（各仓）"][i] = 0;
                        mydata.dq.五项费用[i] = 0;
                        mydata.dq["其他费用（房租、折旧）"][i] = 0;
                        mydata.dq["平台费用占比（包含售后）"][i] = 0;
                        mydata.dq.推广费用占比[i] = 0;
                        mydata.dq.物流费用占比[i] = 0;
                        mydata.dq.包装费用占比[i] = 0;
                        mydata.dq.费用占比合计[i] = 0;
                        mydata.dq.利润比例[i] = 0;
                    }
                }

                console.log(mydata);
                // 加载表格
                load_dq(mydata);
                load_tb(mydata);
                load_hb(mydata);
            },
            error: function () {
                console.log('error');
            }
        });
        // 同比
        $.ajax({
            type: 'get',
            url: 'fytj',
            data: {
                // now当前账期    lastmouth上一个月 环比   lastyear上一年  同比
                zq: 'now'
            },
            async: false,
            success: function (data) {
                //console.log(data);
                loadMydata(mydata);
                let d = data.data;
                console.log(d);
                let n = 0;
                for (let i = 0; i < d.length; i++) {
                    if (d[i].sjxsje != 0) {
                        mydata.tb.产品占比[i] = d[i].erp / d[i].sjxsje;
                        mydata.tb.人工占比[i] = d[i].ryfy / d[i].sjxsje;
                        mydata.tb["综合管理费占比（各仓）"][i] = d[i].zhglf / d[i].sjxsje;
                        mydata.tb.五项费用[i] = d[i].wxfy / d[i].sjxsje;
                        mydata.tb["其他费用（房租、折旧）"][i] = d[i].qtfy / d[i].sjxsje;
                        mydata.tb["平台费用占比（包含售后）"][i] = d[i].dpyyfy / d[i].sjxsje;
                        mydata.tb.推广费用占比[i] = d[i].tgfy / d[i].sjxsje;
                        mydata.tb.物流费用占比[i] = d[i].wlf / d[i].sjxsje;
                        mydata.tb.包装费用占比[i] = d[i].bcf / d[i].sjxsje;
                        mydata.tb.费用占比合计[i] = mydata.tb.产品占比[i] + mydata.tb.人工占比[i] + mydata.tb["综合管理费占比（各仓）"][i] + mydata.tb.五项费用[i] +
                            mydata.tb["其他费用（房租、折旧）"][i] + mydata.tb["平台费用占比（包含售后）"][i] + mydata.tb.推广费用占比[i] +
                            mydata.tb.物流费用占比[i] + mydata.tb.包装费用占比[i];
                        mydata.tb.利润比例[i] = 1 - mydata.tb.费用占比合计[i];
                    } else {
                        mydata.tb.产品占比[i] = 0;
                        mydata.tb.人工占比[i] = 0;
                        mydata.tb["综合管理费占比（各仓）"][i] = 0;
                        mydata.tb.五项费用[i] = 0;
                        mydata.tb["其他费用（房租、折旧）"][i] = 0;
                        mydata.tb["平台费用占比（包含售后）"][i] = 0;
                        mydata.tb.推广费用占比[i] = 0;
                        mydata.tb.物流费用占比[i] = 0;
                        mydata.tb.包装费用占比[i] = 0;
                        mydata.tb.费用占比合计[i] = 0;
                        mydata.tb.利润比例[i] = 0;
                    }
                }

                console.log(mydata);
                // 加载表格
                load_dq(mydata);
                load_tb(mydata);
                load_hb(mydata);
            },
            error: function () {
                console.log('error');
            }
        });
        // 环比
        $.ajax({
            type: 'get',
            url: 'fytj',
            data: {
                // now当前账期    lastmouth上一个月 环比   lastyear上一年  同比
                zq: 'now'
            },
            async: false,
            success: function (data) {
                //console.log(data);
                loadMydata(mydata);
                let d = data.data;
                console.log(d);
                let n = 0;
                for (let i = 0; i < d.length; i++) {
                    if (d[i].sjxsje != 0) {
                        mydata.hb.产品占比[i] = d[i].erp / d[i].sjxsje;
                        mydata.hb.人工占比[i] = d[i].ryfy / d[i].sjxsje;
                        mydata.hb["综合管理费占比（各仓）"][i] = d[i].zhglf / d[i].sjxsje;
                        mydata.hb.五项费用[i] = d[i].wxfy / d[i].sjxsje;
                        mydata.hb["其他费用（房租、折旧）"][i] = d[i].qtfy / d[i].sjxsje;
                        mydata.hb["平台费用占比（包含售后）"][i] = d[i].dpyyfy / d[i].sjxsje;
                        mydata.hb.推广费用占比[i] = d[i].tgfy / d[i].sjxsje;
                        mydata.hb.物流费用占比[i] = d[i].wlf / d[i].sjxsje;
                        mydata.hb.包装费用占比[i] = d[i].bcf / d[i].sjxsje;
                        mydata.hb.费用占比合计[i] = mydata.hb.产品占比[i] + mydata.hb.人工占比[i] + mydata.hb["综合管理费占比（各仓）"][i] + mydata.hb.五项费用[i] +
                            mydata.hb["其他费用（房租、折旧）"][i] + mydata.hb["平台费用占比（包含售后）"][i] + mydata.hb.推广费用占比[i] +
                            mydata.hb.物流费用占比[i] + mydata.hb.包装费用占比[i];
                        mydata.hb.利润比例[i] = 1 - mydata.hb.费用占比合计[i];
                    } else {
                        mydata.hb.产品占比[i] = 0;
                        mydata.hb.人工占比[i] = 0;
                        mydata.hb["综合管理费占比（各仓）"][i] = 0;
                        mydata.hb.五项费用[i] = 0;
                        mydata.hb["其他费用（房租、折旧）"][i] = 0;
                        mydata.hb["平台费用占比（包含售后）"][i] = 0;
                        mydata.hb.推广费用占比[i] = 0;
                        mydata.hb.物流费用占比[i] = 0;
                        mydata.hb.包装费用占比[i] = 0;
                        mydata.hb.费用占比合计[i] = 0;
                        mydata.hb.利润比例[i] = 0;
                    }
                }

                console.log(mydata);
                // 加载表格
                load_dq(mydata);
                load_tb(mydata);
                load_hb(mydata);
            },
            error: function () {
                console.log('error');
            }
        });
    </script>

    <!--柱状图-->
    <script>
        var chartDom = document.getElementById('main');
        var myChart = echarts.init(chartDom);
        var option;

        option = {
            legend: {},
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: {
                type: 'category',
                data: mydata.shop2,
                // data:['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23','24','25','26','27','28','29','30','31','32'],
                name: '店铺'
            },
            yAxis: {
                show: false,
                type: 'value'
            },
            tooltip: {
                show: true,
                target: 'item',
                formatter: function (params) {
                    return showTooltip(mydata, params, 11);
                }
            },
            color: ['#5470c6', '#91cc75', '#f10a00', '#f67a7a', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc', '#01AAED', '#fac858'],
            series: [
                // 当期
                {
                    name: '产品占比',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.产品占比
                },
                {
                    name: '人工占比',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.人工占比
                },
                {
                    name: '综合管理费占比（各仓）',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["综合管理费占比（各仓）"]
                },
                {
                    name: '五项费用',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.五项费用
                },
                {
                    name: '其他费用（房屋、折旧）',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["其他费用（房租、折旧）"]
                },
                {
                    name: '平台费用占比（包含售后）',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["平台费用占比（包含售后）"]
                },
                {
                    name: '推广费用占比',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.推广费用占比
                },
                {
                    name: '物流费用占比',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.物流费用占比
                },
                {
                    name: '包装费用占比',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.包装费用占比
                },
                {
                    name: '费用占比合计',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.费用占比合计
                },
                {
                    name: '利润比例',
                    type: 'bar',
                    stack: 'a',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.利润比例
                },

                // 同比

                {
                    name: '产品占比',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.tb.产品占比
                },
                {
                    name: '人工占比',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.tb.人工占比
                },
                {
                    name: '综合管理费占比（各仓）',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.tb["综合管理费占比（各仓）"]
                },
                {
                    name: '五项费用',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.tb.五项费用
                },
                {
                    name: '其他费用（房屋、折旧）',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.tb["其他费用（房租、折旧）"]
                },
                {
                    name: '平台费用占比（包含售后）',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["平台费用占比（包含售后）"]
                },
                {
                    name: '推广费用占比',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.推广费用占比
                },
                {
                    name: '物流费用占比',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.物流费用占比
                },
                {
                    name: '包装费用占比',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.包装费用占比
                },
                {
                    name: '费用占比合计',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.费用占比合计
                },
                {
                    name: '利润比例',
                    type: 'bar',
                    stack: 'b',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.利润比例
                },

                // 环比

                {
                    name: '产品占比',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.hb.产品占比
                },
                {
                    name: '人工占比',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.hb.人工占比
                },
                {
                    name: '综合管理费占比（各仓）',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.hb["综合管理费占比（各仓）"]
                },
                {
                    name: '五项费用',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.hb.五项费用
                },
                {
                    name: '其他费用（房屋、折旧）',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.hb["其他费用（房租、折旧）"]
                },
                {
                    name: '平台费用占比（包含售后）',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["平台费用占比（包含售后）"]
                },
                {
                    name: '推广费用占比',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["推广费用占比"]
                },
                {
                    name: '物流费用占比',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["物流费用占比"]
                },
                {
                    name: '包装费用占比',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["包装费用占比"]
                },
                {
                    name: '费用占比合计',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq["费用占比合计"]
                },
                {
                    name: '利润比例',
                    type: 'bar',
                    stack: 'c',

                    emphasis: {
                        focus: 'series'
                    },
                    data: mydata.dq.利润比例
                }
            ]
        };

        option && myChart.setOption(option);
    </script>


</div>
</body>

</html>